草庐IT

React 组件

全部标签

javascript - react : Why is `this.props.children` undefined?

我正在使用ReactJS构建电子电阻计算器。我有一个这样声明的组合组件:varResistanceCalculator=React.createClass({getInitialState:function(){return{bands:[0,0,0,0,0]}},componentDidMount:function(){console.log(this.props.children);//=>undefined},render:function(){return();}});BandSelector呈现元素和当一个改变时我想更新ResistanceCalculator的状态。所以我的

javascript - 使用 VueJS 动态加载组件和模板

我正在考虑将VueJS用于多页面网站。官方例子中routing,它们显示您可以根据URL动态更改模板和组件,但它们仍然将所有HTML模板和JS组件放在一个文件中,并一次加载。我的网站会很大,我想只在需要时加载所有内容。所以我的问题是:当URL更改时,我如何按需异步加载这些HTML模板和JS组件?仅展示上面的路由示例是如何进行的会很有帮助可以针对动态脚本加载进行修改。 最佳答案 更新:参见AsyncComponents官方文档中的部分。 关于javascript-使用VueJS动态加载组件

javascript - 在 React 中的 html 输入中转换美分和美元

我的处境有点奇怪,我在我的we应用程序中处理货币。在模型方面,我在发送到服务器之前将货币保存为美分,因为我不想在服务器端处理小数点。但是在View中,我希望显示正常货币而不是美分。所以,我有这个输入字段,我从美元中获取数据并将其更改为美分:当输入值发生变化时,我会在向上游发送之前将其更改回美分:handleUpdate:function(e){varvalue=e.target.value;//changingitbackfromcentstodollarsvalue=parseFloat(value)*100;//savebacktotheparentcomponentmanagin

javascript - 简单的 Ajax 请求,在 React.js 中循环数据

新的react,而不是100%我应该如何处理这个相对简单的问题。我目前正在寻找从Reddit收集一些图像,将这些图像推回到“pImage”状态。然后让这些图像显示在“内容”div中。通常,我只会用for循环来解决这个问题,但是有没有一种特殊的方法我应该用react来处理它?componentDidMount:function(){varself=this;$.get(this.props.source,function(result){varcollection=result.data.children;if(this.isMounted()){this.setState({//Sho

javascript - 扩展原生 d3 组件(如 d3.svg.axis())的惯用方法是什么?

对于d3中的时间序列可视化,我想在轴上突出显示年份。我通过制作我自己的xAxis渲染器实现了这一点,它调用nativeaxis函数,然后实现我自己的自定义逻辑来格式化它渲染的刻度。我就是这样做的(seeworkingexampleonjsbin):xAxis=d3.svg.axis().scale(xScale)customXAxis=function(){xAxis(this);d3.selectAll('.tick',this).classed("year",isYear);};...xAxis.ticks(10);xAxisElement=canvas.append("g").c

javascript - React 0.13 类方法未定义

因此,我从React和ES6开始,并陷入了非常基础的困境。非常感谢您的帮助。handleClick()抛出一个错误:UncaughtTypeError:Cannotreadproperty'handleClick'ofundefined代码如下exportdefaultclassMenuItemsextendsReact.Component{constructor(props){super(props)this.state={active:false}this.handleClick=this.handleClick.bind(this)}handleClick(){this.setS

javascript - React 的 TestUtils.Simulate.keyDown 不起作用

我的应用程序中有很多组件可以响应不同的按键操作,到目前为止,我使用TestUtils.Simulate.keyDown的测试都无法正常工作。似乎keyDown简单明了是行不通的。这是我要测试的组件:描述.jsvarReact=require('react/addons');varDescription=React.createClass({render:function(){return()}});module.exports=Description;这是一个失败的简单测试:描述-test.jsvarReact=require('react/addons');varTestUtils=

javascript - 在 TextInput React-Native 上获取光标位置

有没有人对如何获得TextInput的插入符位置有任何想法?我尝试了onSelectionChange并从DocumentSelectionState创建了一个事件发射器,但似乎都不起作用(无论我选择什么,它们都不会触发任何东西)。例如:https://rnplay.org/apps/eZnvIA 最佳答案 onSelectionChange={(event)=>console.log(event.nativeEvent.selection)} 关于javascript-在TextInp

javascript - 如何在 react-native 的函数中调用函数?

嗨,这是我第一次使用javascript和react-native开发应用程序,这是一个菜鸟问题。如何在__onRegionChangeComplete函数中调用_getData函数?我试过this._getData()它显示了error:undefinedisnotafunction(evaluation'this._getData()')').varReact=require('react-native');var{StyleSheet,Text,View,Image,MapView,Component,}=React;classMapextendsComponent{render

javascript - 使用 React Router 和 Redux Simple Router 的 onEnter Transitions 不要渲染新路由的组件

我有一个使用react@0.14、redux@3.05、react-router@1.0.3和redux-simple-router@2.0.2的应用程序。我正在尝试根据商店状态为我的一些路线配置onEnter转换。转换Hook成功触发并将新状态推送到我的商店,这会更改url。但是,在页面上呈现的实际组件是来自路由匹配的原始组件处理程序,而不是新url的新组件处理程序。这是我的routes.js文件的样子exportdefaultfunctionconfigRoutes(store){constauthTransition=functionauthTransition(location